<div id="app" v-cloak>
    <div class="flex-column">
        <div class="bottom20">
            <el-button type="primary" size="small" @click="common.add(``,[`50%`,`50%`])">添加</el-button>
            <el-button type="danger" size="small" :disabled="delList.length>0?false:true" @click="delAll">删除</el-button>
            <el-button type="primary" size="small" @click="common.refresh()"><el-icon :size="15"><Refresh /></el-icon>
            </el-button>
        </div>
        <el-table ref="table" :data="list.rows" border style="width: 100%" :max-height="600" @selection-change="selectionChange">
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column prop="id" label="ID" width="80" align="center"></el-table-column>
            <el-table-column prop="avatar" label="预览" align="center">
                <template #default="scope" >
                    <mu-show-img :url="scope.row.url" width="50px" height="50px"></mu-show-img>
                </template>
            </el-table-column>
            <el-table-column prop="url" label="物理路径" align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="imagewidth" label="宽度" align="center"></el-table-column>
            <el-table-column prop="imageheight" label="高度" align="center"></el-table-column>
            <el-table-column prop="imagetype" label="图片类型" align="center"></el-table-column>
            <el-table-column prop="filesize" label="文件大小" align="center"></el-table-column>
            <el-table-column prop="mimetype" label="mime类型" align="center">

            </el-table-column>
            <el-table-column prop="status" label="操作" align="center">
                <template #default="scope">
                    <el-button type="primary" v-if="!(seach&&seach.addtabs&&seach.addtabs==1)" size="small" @click="selectFile(scope.row)">选择</el-button>
                    <el-button v-if="seach&&seach.addtabs&&seach.addtabs==1" type="danger" size="small" @click="common.del(scope.row.id,`id`)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="flex-row flex-content-end top20">
            <el-pagination background layout="total, sizes, prev, pager, next, jumper" :total="list.total" @change="changePage" @size-change="changeSize"/>
        </div>
    </div>
</div>